

var users = new Array();  //存放所有用户的数组
var operateType;    //按钮的操作类型

// 创建用户的构造方法
function user(code, userName, sex, passWord, age, birthday) {
    this.code = code;
    this.userName = userName;
    this.sex = sex;
    this.passWord = passWord;
    this.age = age;
    this.birthday = birthday;
}

// 初始化数据
function init() {
    users[0] = new user("1001", "张三", "女", "111", "31", "1991-1-1");
    users[1] = new user("1002", "李四", "男", "222", "32", "1992-2-2");
    users[2] = new user("1003", "王五", "女", "333", "33", "1993-3-3");
    users[3] = new user("1004", "赵六", "女", "333", "33", "1994-4-3");


    refresh(users); // 保证表格中数据是最新的
}



// 刷新表格
function refresh(users) {
    var tbody = document.getElementById("tbody");
    var html = " ";
    var color = "warning";
    var flag = true;
    for (var i in users) {
        if (flag) {
            color = "info";
        } else {
            color = "warning";
        }
        html = html + "<tr class = '" + color + "' ><td style = 'width:30px;'><input type = 'checkbox'></td><td id = 'code'>"
            + users[i].code + "</td><td id = 'userName'>"
            + users[i].userName + "</td><td id = 'sex'>"
            + users[i].sex + "</td><td id = 'passWord'>"
            + users[i].passWord + "</td><td id = 'age'>"
            + users[i].age + "</td><td id = 'birthday'>"
            + users[i].birthday + "</td>"
            + "</tr>";
            flag = !flag   //颜色转换
    }
    tbody.innerHTML = html;   //在表格中创建所有的tr元素
}


// 当点击添加按钮
$("#user_add").on("click", function(){
    operateType = "add";
});

//当点击修改按钮
$("#user_edit").on("click", function(){
    operateType = "edit";
});

// 添加用户
$("#save").on("click", function(){
    if(operateType == "add") {
        var newUser = new user($("#m_code").val(), $("#m_userName").val(), $("#m_sex").val(), $("#m_passWord").val(),
        $("#_age").val(), $("#m_birthday").val());
        users = users.concat(newUser);  // 在原数组中添加一个新的用户元素
    } else if (operateType == "edit") {
        for(var i = 0; i < users.length; i++) {
            users[i].code = $("#_code").val();
            users[i].userName = $("#m_userName").val();
            users[i].sex = $("#m_sex").val();
            users[i].passWord = $("#m_passWord").val();
            users[i].age = $("#m_age").val();
            users[i].birthday = $("#m_birthday").val();
        }
    }
    alert("修改成功");

});



//删除用户
$("#user_delete").on("click", function(){
    var checkboxs = $("input[type='checkbox']");  // 获取所有复选框
    let f = false;   // 是否选中用户的标记
    for(var i = 0; i < checkboxs.length; i++) {
        var box = checkboxs[i];
        if (box.checked) {      // 某个复选框被选中
            f = true;          //标记 有 复选框被选中
            box = $(box);    //jsdom对象转换成jquery对象
            let code = box.parent().siblings("#code").text();  //复选框父级的兄弟#code元素
            for(var i = 0; i<users.length; i++) {
                if(code == users.code) {
                    users.splice(i, 1);   //删除1个数组中下标为i的元素
                    alert("删除成功");
                }
            }

        }
    }
    if(!f) {
        alert("请选择一个用户！");
    }
    refresh(users); //保证表格中数据是最新的
});
var code; //被修改的用户编号

var newusers;

//查询用户
$("#user_find").on("click", function(){
    newusers = new Array();
    var codeLike = $(this).siblings("#s_code").val();
    for(var i = 0; i < users.length; i++) {
        if(users[i].code.indexof(codeLike)>=0) {   //如果用户编号中存在被查询的编号关键字
            newusers = newusers.concat(users[i]);  //将这个对象添加到一个全新的数组中
        }
    }
    refresh(newusers);  //保证表格中数据是最新的
})
